export default `
<a href="https://feidao-edu.gitee.io/widgets/fd-h000000.html" target="_blank" style="color:red;margin-right:10px;">api地址</a>
<link href="https://cdn.jsdelivr.net/npm/feidao-css/feidao.css" type="text/css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/feidao-css/theme/blue.css" type="text/css" rel="stylesheet">
<style>
.fa-icon {
  line-height: 2.5em;
  font-size: 2.5em;
  display: inline-block;
}

.fa-spin {
  -webkit-animation: fa-spin 1s infinite linear;
  animation: fa-spin 1s infinite linear;
}

@-webkit-keyframes fa-spin {
  0% {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  }
  100% {
  -webkit-transform: rotate(359deg);
  transform: rotate(359deg);
  }
}

@keyframes fa-spin {
  0% {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  }
  100% {
  -webkit-transform: rotate(359deg);
  transform: rotate(359deg);
  }
}

ul {
  -webkit-padding-start: 0;
}

ul li {
  list-style: none;
  text-align: center;
}

#test {
  color: #000;
}
</style>
<div data-feidao-actions="fdwe-pulling-up:eu-041,fdwe-pulling-down:eu-042,fdwe-scroll-end:eu-043">
<div class="pure-u-1">
  <section style="background:pink; ">
    <div class="pos-r bg-default z-index10 text-c color-fff " style="top:0;left:0;width:100%;height:2.5em;line-height:2.5em; ">禁用下拉示例</div>
    <fd-h000000 id="fd-h000000-001" style="width:9em;height:8.7em;" enable-pulldown-refresh='false' enable-pullupLoad>
      <div slot='content' class="relative overflow-y-s overflow-x-a" style="left:0em; top:0em; height:auto;">
        <ul>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表1</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表2</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表3</li>
        </ul>
      </div>
    </fd-h000000>
  </section>
  <textarea rows=5 cols=30><fd-h000000 id="fd-h000000-001" style="width:9em;height:8.7em;" enable-pulldown-refresh='false' enable-pullupLoad>
  <div slot='content' class="relative overflow-y-s overflow-x-a" style="left:0em; top:0em; height:auto;">
	<ul>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表1</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表2</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表3</li>
	</ul>
  </div>
</fd-h000000></textarea>
</div>
<!-- 通过设置控件的 enable-pulldown-refresh 属性，从而禁用上滑加载  -->
<div class="pure-u-1">
  <section>
    <div class="pos-r bg-default z-index10 text-c color-fff " style="top:0;left:0;width:100%;height:2.5em;line-height:2.5em; ">禁用上滑</div>
    <fd-h000000 id="fd-h000000-002" style="width:9em;height:8.7em;" enable-pulldown-refresh enable-pullupLoad='false'>
      <div slot='content' class="relative overflow-y-s overflow-x-a" style="left:0em; top:0em; height:auto;">
        <ul slot='content'>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表1</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表2</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表3</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表5</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表6</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表7</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表8</li>
        </ul>
      </div>
      <div class="text-c" slot="pullup_wrapper">
        <span class="">正在加载更多数据...</span>
      </div>
    </fd-h000000>
  </section>
  <textarea rows=5 cols=30><fd-h000000 id="fd-h000000-002" style="width:9em;height:8.7em;" enable-pulldown-refresh enable-pullupLoad='false'>
  <div slot='content' class="relative overflow-y-s overflow-x-a" style="left:0em; top:0em; height:auto;">
	<ul slot='content'>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表1</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表2</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表3</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表5</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表6</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表7</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表8</li>
	</ul>
  </div>
  <div class="text-c" slot="pullup_wrapper">
	<span class="">正在加载更多数据...</span>
  </div>
</fd-h000000></textarea>
</div>
<!-- 在控件内添加div元素，分别设置属性(slot='pulldown_wrapper' 和 slot="pullup_wrapper")从而替换控件下拉样式和上滑样式。
  tip: 需要添加逻辑判断下拉加载是否获取到新的数据，如果没有话，通过 DOM选择器 获取自定义的下拉展示的节点，修改其内容，通知用户没有数据了。
 -->
<div class="pure-u-1">
  <section style="background:pink; ">
    <div class="pos-r bg-default z-index10 text-c color-fff " style="top:0;left:0;width:100%;height:2.5em;line-height:2.5em; ">启用下拉、上滑</div>
    <fd-h000000 id="fd-h000000-003" style="width:9em;height:8.7em;" enable-pulldown-refresh enable-pullupLoad>
      <div slot='pulldown_wrapper' style="height:2.5em;line-height:2.5em;text-align:center;margin-top:-2.5em;">
        <span>正在刷新...</span>
      </div>
      <div slot='content' class="relative overflow-y-s overflow-x-a" style="left:0em; top:0em; height:auto;">
        <ul>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表1</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表2</li>
          <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表3</li>
        </ul>
      </div>
      <div class="text-c" slot="pullup_wrapper">
        <span class="">正在加载更多数据...</span>
      </div>
    </fd-h000000>
  </section>
  <textarea rows=5 cols=30><fd-h000000 id="fd-h000000-003" style="width:9em;height:8.7em;" enable-pulldown-refresh enable-pullupLoad>
  <div slot='pulldown_wrapper' style="height:2.5em;line-height:2.5em;text-align:center;margin-top:-2.5em;">
	<span>正在刷新...</span>
  </div>
  <div slot='content' class="relative overflow-y-s overflow-x-a" style="left:0em; top:0em; height:auto;">
	<ul>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表1</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表2</li>
	  <li class="border-b-1 " style="height:2.5em;line-height:2.5em; ">列表3</li>
	</ul>
  </div>
  <div class="text-c" slot="pullup_wrapper">
	<span class="">正在加载更多数据...</span>
  </div>
</fd-h000000></textarea>
</div>
</div>
<textarea rows=5 cols=30 id="fd-h000000-055"></textarea>

`;